const h = `
<nav class="navbar">
    <div class="navbar__container">
        <img id="navbar__img" src="images/лого ЦДМ_2020 10х10 см_горизонт.png" alt="Центр диагностики и телемедицины: Версия для сотрудников">
        <a href="index.html" id="navbar__logo"></a>
        <div class="navbar__toggle" id="mobile-menu">
            <span class="bar"></span><span class="bar"></span><span class="bar"></span>
        </div>
        <ul class="navbar__menu">
            <li class="navbar__item">
                <a href="profile.html" class="navbar__links"> Профиль </a>
            </li>
            <li class="navbar__item">
                <a href="profile.html" class="navbar__links"> Расписание </a>
            </li>
            <li class="navbar__btn">
                <button type="button" class="logout" id="login__button" onClick="window.location= 'login.html'"> Выйти из аккаунта </a>
            </li>
        </ul>
    </div>
</nav>
`

const f = `
<nav class="footer">
    <div class="footer__container">
          <div class="footer__link--items">
            <a href="/">Техническая поддержка</a>
            <p class="website__rights">Москва © 2024</p>
            <a href="/">Условия пользования сайтом</a>
      </div>
    </div>
</nav>
`
document.addEventListener("DOMContentLoaded", function () {

    // вставление шапки во все страницы
    document.querySelector("#header").outerHTML = h;
    document.querySelector("#footer").outerHTML = f;

    // функционал меню для маленьких экранов
    const menu = document.querySelector('#mobile-menu')
    const menuLinks = document.querySelector('.navbar__menu')
    menu.addEventListener('click', function () {
        menu.classList.toggle('is-active');
        menuLinks.classList.toggle('active');
        console.log("clicked menu");
    })
})